<template>
	<view class="wrap">
		<block v-if="!bgMain">
			<view class="bg_view">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/login-view.png"></image>
			</view>

			<view class="from_view">
				<view class="from-name">手机号</view>
				<view class="form">
					<view class="form_left">
						<view class="form_left_icon">
							<image :src="imgurl + '1.png'" mode="aspectFill"></image>
						</view>
						<view class="form_left_input">
							<input type="number" v-model="phone" maxlength="11" placeholder="请输入手机号码"
								placeholder-style="font-size: 30rpx;font-weight: 400;color: #b1b2b5;">
						</view>
					</view>
				</view>
				<view class="from-name">密码</view>
				<view class="form">
					<view class="form_left">
						<view class="form_left_icon">
							<image :src="imgurl + '2.png'" mode="aspectFill"></image>
						</view>
						<view class="form_left_input">
							<input type="password" v-model="password" placeholder="请输入密码"
								placeholder-style="font-size: 30rpx;font-weight: 400;color: #b1b2b5;" v-if="show">
							<input type="text" v-model="password" placeholder="请输入密码"
								placeholder-style="font-size: 30rpx;font-weight: 400;color: #b1b2b5;" v-else>
						</view>
					</view>
					<view class="form_right" @click="show = !show">
						<image v-if="show" :src="imgurl + '3.png'" mode="aspectFill"></image>
						<image v-else :src="imgurl + '4.png'" mode="aspectFill"></image>
					</view>
				</view>
				<view class="tips_box flex_b">
					<view class="tips_left">
						<view class="tips_left_icon" @click="isPick = !isPick">
							<image v-if="isPick" :src="imgurl + '5.png'" mode="aspectFill"></image>
							<image v-else :src="imgurl + '6.png'" mode="aspectFill"></image>
						</view>
						<view class="tips_left_text">
							已同意<text @click="$u.route('/pages/login/privacyPact?type=2')">隐私协议</text>及<text
								@click="$u.route('/pages/login/privacyPact?type=1')">用户协议</text>
						</view>
					</view>
					<view class="tips_right" @click="$u.route('/pages/login/registerOne')">
						忘记密码
					</view>
				</view>
				<view class="submit" @click="userLoginFun">
					立即登录
				</view>
				<view class="register" @click="$u.route('/pages/login/register')">
					新用户注册
				</view>
			</view>
			<!-- <view class="base_box flex_c" v-if="iosMain || !iosMain && !submitShow"> -->
			<view class="base_box flex_c">
				<!-- <view class="base_btn one" @click="bindGetUserInfoOne">
          <image :src="imgurl + '7.png'" mode="aspectFill"></image>
        </view> -->
				<view class="base_btn" @click="bindGetUserInfoWxxcx">
					<image :src="imgurl + '8.png'" mode="aspectFill"></image>
				</view>

			</view>
		</block>
		<u-popup :show="AuthorizeMain" :closeOnClickOverlay="false" :safeAreaInsetBottom="false" mode="center"
			bgColor="#ffffff00" @close="AuthorizeMain = false">
			<view class="alter-box-two">
				<view class="title">温馨提示</view>
				<view class="content">剂安安APP将获取您的手机摄像头，扫码，照片上传等权限，进行扫码操作，相关协议请看<text
						@click="$u.route('/pages/login/privacyPact?type=1')">《用户协议》</text>、<text
						@click="$u.route('/pages/login/privacyPact?type=2')">《隐私协议》</text></view>
				<view class="btn-a">
					<view class="left" @click="AuthorizeMainFun(1)">我同意</view>
					<view class="right" @click="AuthorizeMainFun(0)">不同意,暂不登录</view>
				</view>
			</view>
		</u-popup>

	</view>
</template>

<script>
	import {
		userLogin,
		wechatLogin,
		wxxcxLogin,
		setQQLogin,
		getUserInfo,
		getCheckAppStatus,
		check_search_status
	} from '@/api/api';
	export default {
		data() {
			return {
				AuthorizeMain: false,
				bgMain: true,
				show: true,
				isPick: true,
				phone: '',
				password: '',
				iosMain: false,
				submitShow: true,
				alterMain: false,
				percentVal: 0
			}
		},
		onLoad(opition) {
			const that = this;
			console.log(123);
			that.onLoadFun()
			uni.getSystemInfo({
				success(res) {
					if (res.platform == 'android') {
						that.iosMain = true
					} else {
						that.iosMain = false
					}
					// that.onLoadFun(opition)
					// #ifdef APP-PLUS
					// hot(false, (res) => {
					//   that.percentVal = res.progress
					//   if (that.percentVal != 0 && that.percentVal < 100) {
					//     that.alterMain = true
					//   } else {
					//     that.alterMain = false
					//   }
					//   // if (that.percentVal == 100) {
					//   //   that.onLoadFun(opition);
					//   // }
					// }, () => {
					//   // that.onLoadFun(opition);
					// });
					// // #endif
					// #ifndef APP-PLUS

					// that.onLoadFun(opition)
					// #endif
				}
			});
			that.$nextTick(() => {
				that.bgMain = false;
			})
			// let res = {
			// 		"ret": 0,
			// 		"openid": "BFA3980531C183BD6399BC124ED1DF2D",
			// 		"access_token": "D52CE68DA20304CFDCAED4ACA37B42E1",
			// 		"pay_token": "25DC662EE2E6038203AA29D9CFEF5F7B",
			// 		"expires_in": 7776000,
			// 		"pf": "desktop_m_qq-10000144-android-2002-",
			// 		"pfkey": "35a2d45bbc35499a6c437661725d8233",
			// 		"msg": "",
			// 		"login_cost": 28,
			// 		"query_authority_cost": 0,
			// 		"authority_cost": 0
			// 	}
			// 	setQQLogin(res)
		},
		onShow() {
			// uni.setStorageSync('Authorize', false);
			uni.hideLoading();
			let isLogOff = uni.getStorageSync('isLogOff');
			if (!isLogOff) {
				getCheckAppStatus().then((res) => {
					this.submitShow = res.data;
				})
				check_search_status().then((res) => {
					uni.setStorageSync('check_search', res.data)
				}).catch(err => {
					uni.setStorageSync('check_search', false)
				})
			}
		},
		methods: {

			onLoadFun(opition) {
				// const token = this.$store.getters.token
				// if (token) {
				//   console.log(opition, '[][][][][]')
				//   if (opition.login) {
				//     uni.showToast({
				//       title: '登录认证无效,请重新登录',
				//       icon: 'none',
				//       duration: 2000
				//     });
				//     uni.setStorageSync("token", '')
				//     this.$store.commit('LOGOUT');
				//     this.bgMain = false
				//   } else {
				//     if (uni.getStorageSync("bind_phone") == 1) {
				//     } else {
				//       uni.$u.toast('请先绑定手机号');
				//       uni.reLaunch({
				//         url: '/pages/login/bind'
				//       })
				//     }

				//   }
				// } else {
				//   this.bgMain = false
				// }


				let token = uni.getStorageSync('token');
				if (token) {
					this.toHomeFunOne();
				}
			},
			toHomeFunOne() {
				if (uni.getStorageSync('Authorize') != true) {
					if (!this.iosMain) {
						this.AuthorizeMain = true;
					} else {
						uni.navigateTo({
							url: '/pages/login/loginView'
						})
					}
					this.bgMain = false;
				} else {
					this.toHomeFun();
				}
			},
			AuthorizeMainFun(value) {
				if (value == 1) {
					uni.setStorageSync('Authorize', true);
					this.toHomeFun();
				} else {
					uni.setStorageSync("token", '')
					this.$store.commit('LOGOUT');
				}
				this.AuthorizeMain = false;
			},
			toHomeFun() {
				const that = this;
				uni.reLaunch({
					url: '/pages/tabbar/index'
				})
				// getCheckAppStatus().then((res) => {
				//   uni.showLoading({
				//     title: '正在加载数据中',
				//     mask: true
				//   })
				//   this.submitShow = res.data;
				//   if (this.submitShow) {
				//     getUserInfo().then((res) => {
				//       let loginArr = uni.getStorageSync("loginArr")
				//       if (!loginArr) loginArr = []
				//       if (loginArr.indexOf(res.data.id) != -1) {
				//         uni.hideLoading();
				//         uni.$u.toast('该账号已被注销!');
				//         uni.setStorageSync("token", '')
				//         that.$store.commit('LOGOUT');
				//         that.bgMain = false;
				//         return
				//       } else {
				//         uni.$u.toast('登录成功');
				//         uni.reLaunch({
				//           url: '/pages/tabbar/index'
				//         })
				//       }
				//     }).catch(err => {
				//       console.log(err, '[里面]');
				//       uni.$u.toast('网络超时，请稍后再试');
				//     })
				//   } else {
				//     uni.$u.toast('登录成功');
				//     uni.reLaunch({
				//       url: '/pages/tabbar/index'
				//     })
				//   }
				// }).catch(err => {
				//   console.log(err, '[外面]');
				//   uni.hideLoading();
				//   uni.$u.toast('网络超时，请稍后再试');
				// })
			},
			bindGetUserInfo(e) {
				var that = this;
				if (that.isPick) {
					return uni.$u.toast('请先同意隐私，用户协议');
				}
				uni.login({
					provider: 'weixin',
					// onlyAuthorize: true,
					success(res) {
						console.log(res, 'res')
						if (res.authResult) {
							uni.showLoading({
								title: '正在登录'
							});
							//发起网络请求
							res.iosMain = that.iosMain ? 2 : 1
							wechatLogin(res.authResult).then((res1) => {
								uni.hideLoading();
								if (res1.data.bind_phone == 1) {

									uni.setStorageSync("bind_phone", 1)
									uni.setStorageSync("token", res1.data.token)
									that.$store.commit("LOGIN", {
										'token': res1.data.token
									});
									that.toHomeFunOne();
								} else {
									uni.$u.toast('请绑定手机号');
									that.$store.commit("LOGIN", {
										'token': res1.data.token
									});
									uni.setStorageSync("bind_phone", 0)
									uni.navigateTo({
										url: '/pages/login/bind'
									})
								}
							}).catch((e) => {
								console.log(e, '[]')
								uni.hideLoading();
								uni.$u.toast(typeof e === 'string' ? e : '请检查网络连接');
							})
						} else {
							console.log(res.errMsg);
						}
					},

				});

			},
			bindGetUserInfoWxxcx(e) {//微信小程 微信序登录
				var that = this;
				if (that.isPick) {
					return uni.$u.toast('请先同意隐私，用户协议');
				}
				uni.login({
					provider: 'weixin',
					// onlyAuthorize: true,
					success(res) {
						console.log(res, 'res')
						if (res.code) {
							uni.showLoading({
								title: '正在登录'
							});
							//发起网络请求
							res.iosMain = that.iosMain ? 2 : 1
							wxxcxLogin({code:res.code}).then((res1) => {
								uni.hideLoading();
								if (res1.data.bind_phone == 1) {
			
									uni.setStorageSync("bind_phone", 1)
									uni.setStorageSync("token", res1.data.token)
									that.$store.commit("LOGIN", {
										'token': res1.data.token
									});
									that.toHomeFunOne();
								} else {
									uni.$u.toast('请绑定手机号');
									that.$store.commit("LOGIN", {
										'token': res1.data.token
									});
									uni.setStorageSync("bind_phone", 0)
									uni.navigateTo({
										url: '/pages/login/bind'
									})
								}
							}).catch((e) => {
								console.log(e, '[]')
								uni.hideLoading();
								uni.$u.toast(typeof e === 'string' ? e : '请检查网络连接');
							})
						} else {
							console.log(res.errMsg);
						}
					},
			
				});
			
			},
			bindGetUserInfoOne() {
				var that = this;
				if (that.isPick) {
					return uni.$u.toast('请先同意隐私，用户协议');
				}
				uni.showLoading({
					title: '正在连接QQ'
				});
				uni.login({
					provider: 'qq',
					success(res) {
						uni.showLoading({
							title: '正在登录'
						});
						if (res.authResult) {
							//发起网络请求
							res.iosMain = that.iosMain ? 2 : 1
							setQQLogin(res.authResult).then((res1) => {
								uni.hideLoading();
								if (res1.data.bind_phone == 1) {
									uni.setStorageSync("bind_phone", 1)
									uni.setStorageSync("token", res.data.token)
									that.$store.commit("LOGIN", {
										'token': res1.data.token
									});
									that.toHomeFunOne();
								} else {
									uni.$u.toast('请绑定手机号');
									that.$store.commit("LOGIN", {
										'token': res1.data.token
									});
									uni.setStorageSync("bind_phone", 0)
									uni.navigateTo({
										url: '/pages/login/bind'
									})
								}
							}).catch((e) => {
								uni.hideLoading();
								uni.$u.toast(typeof e === 'string' ? e : '请检查网络连接');
							})
						} else {
							uni.hideLoading();
							uni.$u.toast(res.errMsg);
						}
					},
					complete() {
						uni.hideLoading();
					}
				})
			},
			userLoginFun() {
				const {
					isPick,
					phone,
					password
				} = this
				const that = this
				if (phone == "") {
					return uni.$u.toast('请输入手机号码');
				}
				if (password == "") {
					return uni.$u.toast('请输入密码');
				}
				if (isPick) {
					return uni.$u.toast('请先同意隐私，用户协议');
				}
				uni.showLoading({
					title: '登录中'
				})
				userLogin({
					phone: phone,
					password: password
				}).then((res) => {
					uni.hideLoading();
					uni.setStorageSync("bind_phone", 1)
					uni.setStorageSync("token", res.data.token)
					that.$store.commit("LOGIN", {
						'token': res.data.token,
						'time': 60 * 60 * 24 * 6000
					});
					// that.chooseImage()
					that.toHomeFunOne();
				}).catch((e) => {
					console.log(e)
					uni.hideLoading();
					uni.$u.toast(typeof e === 'string' ? e : '请检查网络连接');
				})
			},
			doLogin() {
				let that = this
				this.butLoding = true
				doLogin(this.form).then(ref => {
					console.log('ref', ref)
					this.butLoding = false
					that.$store.commit("LOGIN", {
						'token': ref.data.token,
						'time': 60 * 60 * 24 * 6000
					});
					uni.setStorageSync("token", res.data.token)
					this.$u.toast('登录成功')
					uni.navigateBack({
						delta: 1
					})
					// uni.$u.route({
					// 	url: '/pages/home',
					// 	type: 'redirect'
					// });
				})
			},
			chooseImage() {
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'],
					success: function(res) {
						console.log(res.tempFilePaths)
						uni.setStorageSync('submitImgSrc', res.tempFilePaths[0])
						uni.navigateTo({
							url: '/pages/scans/loading'
						})
						// 预览图片
						// uni.previewImage({
						// 	urls: res.tempFilePaths,
						// 	longPressActions: {
						// 		itemList: ['发送给朋友', '保存图片', '收藏'],
						// 		success: function(data) {
						// 			console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data
						// 				.index + 1) + '张图片');
						// 		},
						// 		fail: function(err) {
						// 			console.log(err.errMsg);
						// 		}
						// 	}
						// });
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.ad-view {
		background-color: #ffffff;
		margin-bottom: 10px;
	}

	.wrap {
		width: 750rpx;

		padding-top: 0rpx;
		overflow: hidden;
		box-sizing: border-box;

		.bg_view {
			width: 750rpx;
			height: 630rpx;
			margin: 0 auto;
			position: relative;
			z-index: 1;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.from_view {
			width: 100%;
			border-radius: 54rpx 54rpx 0 0;
			padding: 50rpx 0;
			background-color: white;
			margin-top: -190rpx;
			position: relative;
			z-index: 2;
			overflow: hidden;
		}

		.logo_box {
			margin-bottom: 92rpx;

			.logo {
				width: 266rpx;
				height: 114rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.nickname {
				margin-left: 18rpx;
				font-size: 50rpx;
				color: #434242;
			}
		}

		.from-name {
			margin: 0 auto;
			width: 620rpx;
			line-height: 70rpx;
			font-size: 30rpx;
			color: #383838;
		}

		.form {
			margin: 0 auto 36rpx;
			width: 630rpx;
			height: 100rpx;
			// background: #f6f7fb;
			// border-radius: 65rpx;
			border-bottom: 1rpx solid #eef0f4;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 50rpx 0 0rpx;
			box-sizing: border-box;

			.form_left {
				display: flex;
				align-items: center;

				.form_left_icon {
					width: 49rpx;
					height: 49rpx;

					image {
						width: 100%;
						height: 100%;
					}
				}

				.form_left_input {
					width: 350rpx;
					margin-left: 12rpx;
					font-size: 38rpx;
					font-weight: bold;
					color: #434242;
				}
			}

			.form_right {
				width: 49rpx;
				height: 49rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}
		}

		.tips_box {
			margin: 0 82rpx;

			.tips_left {
				display: flex;
				align-items: center;

				.tips_left_icon {
					width: 28rpx;
					height: 28rpx;
					font-size: 0;

					image {
						width: 100%;
						height: 100%;
					}
				}

				.tips_left_text {
					margin-left: 15rpx;
					font-size: 24rpx;
					color: #737373;

					text {
						margin: 0 6rpx;
						color: #497de3;
					}
				}
			}

			.tips_right {
				font-size: 30rpx;
				color: #434242;
			}
		}

		.submit {
			margin: 83rpx auto 23rpx;
			width: 586rpx;
			height: 100rpx;
			background: linear-gradient(to right, #5089fa, #00d9ca);
			border-radius: 50rpx;
			box-shadow: 0rpx 3rpx 6rpx 0rpx rgba(0, 185, 255, 0.2);
			font-size: 30rpx;
			line-height: 100rpx;
			font-weight: bold;
			text-align: center;
			color: #ffffff;
		}

		.register {
			font-size: 30rpx;
			text-align: center;
			color: #434242;
			margin-top: 40rpx;
		}
	}

	.base_box {
		position: relative;
		margin: 10rpx auto 70rpx auto;

		.base_btn {
			margin: 0 30rpx;
			width: 94rpx;
			height: 94rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.base_box.one {
			background-color: #737373;
			border-radius: 50%;
			overflow: hidden;
		}
	}

	.alter-box-two {
		width: 560rpx;
		border-radius: 20rpx;
		background-color: white;
		padding: 30rpx 30rpx 50rpx 30rpx;
		font-size: 30rpx;
		line-height: 50rpx;
		color: #303030;

		.title {
			font-size: 40rpx;
			font-weight: 700;
			text-align: center;
		}

		.content {
			padding: 40rpx 0;
			line-height: 56rpx;

			text {
				color: #2767e6;
			}
		}

		.btn-a {
			width: 100%;
			text-align: left;
			overflow: hidden;
			font-size: 26rpx;
			color: white;
			line-height: 80rpx;

			.left {
				width: 100%;
				display: inline-block;
				vertical-align: top;
				border-radius: 40rpx;
				text-align: center;
				background-color: #2767e6;
			}

			.right {
				width: 100%;
				display: inline-block;
				vertical-align: top;
				border-radius: 40rpx;
				text-align: center;
				background-color: #999999;
				margin-top: 20rpx;
			}
		}
	}
</style>